<!--
 * @Description: 
 * @Date: 2023-03-31 15:52:54
 * @LastEditTime: 2023-04-10 15:47:50
 * @Author: Black
 * @FilePath: \store_admin\src\views\image\list.vue
-->
<template>
  <el-container class="bg-white rounded-lg" :style="{ height: (h + 'px') }">
    <el-container>
      <ImageMain ref="ImageMainRef"></ImageMain>
      <ImageAside ref="ImageAsideRef" @change="handleAsideChange" @upload="handleOpenUpload"></ImageAside>
    </el-container>
  </el-container>
</template>

<script setup>
import { ref } from 'vue';
import ImageMain from '~/components/ImageMain.vue'
import ImageAside from '~/components/ImageAside.vue'

// 获取浏览器可视化部分高度
const windowHight = window.innerHeight || document.body.clientHeight
const h = windowHight - 64 - 56 - 40

const ImageMainRef = ref(null)

const handleAsideChange = (image_class_id) => {
  ImageMainRef.value.loadData(image_class_id)
}

const handleOpenUpload = () => ImageMainRef.value.openUploadFile()

</script>

<style scoped>

</style>